<script setup lang="ts">

import logo from "@/assets/logo.png";
import { withDefaults, defineProps } from "vue";
interface Props {
  pictureList: any[];
}

const props =withDefaults(defineProps<Props>(), {
  pictureList: () => [],
});
</script>

<template>
  列表
  <a-list :grid="{ gutter: 16, xs: 1, sm: 2, md: 4, lg: 4, xl: 6, xxl: 3 }" item-layout="horizontal" :data-source="props.pictureList">
    <template #renderItem="{item}">
      <a-card hoverable>
        <template #cover>
          <img alt="example" :src="item.url" />
        </template>
        <a-card-meta :title="item.title">
          <template #description>{{item.title}}</template>
        </a-card-meta>
      </a-card>
    </template>
  </a-list>

</template>

<style scoped>

</style>